
import React from 'react'
import {Card,Input,Button} from 'antd'
import SearchForm from "../../../components/common/SearchForm";
import Store from "./Store";
import OperationDiv from "../../../components/common/OperationDiv";
import ComTable from "./Table";
import ComForm from "./Form";
import {observer} from 'mobx-react'
import AdminPermissionForm1 from "./AdminPermissionForm";
import CloudPermissionForm from "./CloudPermissionForm";

@observer
class Index1 extends React.Component{
    constructor(props) {
        super(props);
        this.state = {}
    }

    render() {
        return (
           <Card>
               <SearchForm>
                   <SearchForm.Item span={6} title="角色名称">
                       <Input allowClear value={Store.searchMap.name} onChange={e => Store.searchMap.name = e.target.value} placeholder="请输入"/>
                   </SearchForm.Item>
                   <SearchForm.Item span={6}>
                       <Button type="primary" icon="sync" onClick={Store.handleReset}>重置</Button>
                       <Button style={{marginLeft:10}} type="primary" icon="search" onClick={Store.handleSearch}>搜索</Button>
                   </SearchForm.Item>
               </SearchForm>

               <OperationDiv>
                   <Button type="primary" icon="plus" onClick={() => Store.showForm()}>创建角色</Button>
               </OperationDiv>
                {/*表格*/}
               <ComTable />
                {/*表单们*/}
               {Store.formVisible && <ComForm/>}
               {Store.adminPermissionVisible && <AdminPermissionForm1 />}
               {Store.cloudPermissionVisible && <CloudPermissionForm />}
           </Card>
        );
    }
}

export default Index1;
